import React, {Component} from "react";
import {
    View,
    Text,
    Image,
    TouchableOpacity,
    StyleSheet,
    TextInput,
    Button,
    AsyncStorage,
} from 'react-native';
import Toast, {DURATION} from 'react-native-easy-toast'
import HttpUtils from '../common/HttpUtils'

export default class Login extends Component {
    constructor(props) {
        super(props);
        this.state = {
            name: '',
            password: '',
            text:''
        }
    }

    Save(name,data){
        AsyncStorage.setItem(name, JSON.stringify(data), (err) => {
            if (!err) {
                this.toast.show('登陆成功', DURATION.LENGTH_LONG)
                if(name=='user'){
                    this.props.navigation.goBack()
                }
            }else {
                this.toast.show('保存失败',DURATION.LENGTH_LONG);
            }
        })
    }

    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.text}>安康机场 互联网+四维化信息平台</Text>
                <TextInput
                    style={styles.input}
                    onChangeText={(text) => this.setState({name: text})}
                    value={this.state.name}
                    placeholder={'输入用户名'}
                    underlineColorAndroid={'transparent'}
                />
                <View style={styles.line}></View>
                <TextInput
                    style={styles.input}
                    secureTextEntry={true}
                    onChangeText={(text) => this.setState({password: text})}
                    value={this.state.password}
                    placeholder={'输入密码'}
                    underlineColorAndroid={'transparent'}
                />
                <View style={styles.line}></View>
                <View style={styles.button}>
                    <Button
                        onPress={() => {
                            HttpUtils.post('http://sxakjc.com/api/auth/login', {
                                "username": this.state.name,          //admin
                                "password": this.state.password       //akjc8170065
                            }).then((res)=> {
                                this.Save('token',res.token);
                                this.Save('user',res.user)
                            },(err)=>{
                                console.log(err);
                            })
                        }}
                        title="登陆"
                        color="#1525be"
                        accessibilityLabel="Learn more about this purple button"
                    />
                </View>
                <View style={styles.button}>
                    <Button
                        onPress={() => {
                            this.props.navigation.goBack()
                        }}
                        title="返回"
                        color="#9b9b9b"
                        accessibilityLabel="Learn more about this purple button"
                    />
                </View>
                <Toast ref={toast => {
                    this.toast = toast
                }}/>
            </View>
        )
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: "white",
    },
    text: {
        fontSize: 18,
        color: "#000",
        justifyContent: "center",
        alignItems: "center",
        textAlign: "center",
        margin: 20
    },
    input: {
        fontSize: 16,
        marginTop: 10,
        marginLeft: 20
    },
    line: {
        height: 1,
        backgroundColor: "#ccc"
    },
    button: {
        margin: 20,
        marginBottom: 0
    }
})